<template>
    <div class="login_page">
        <div>
          <h2>{{tipMsg.text}}</h2>
    <button bind:click="handleClick" type="primary" open-type="getUserInfo"
    @getuserinfo="bindGetUserInfo" @click="checkWx">{{tipMsg.btnText}}</button>
        </div>
    </div>
</template>

<script>
import api from "@/utils/api";
import { setTimeout } from "timers";
export default {
  data() {
    return {
      current: "homepage",
      formData: {
        avatarUrl: "",
        city: "",
        code: "",
        country: "",
        encryptedData: "",
        gender: "",
        iv: "",
        nickName: "",
        province: "",
        rawData: "",
        signature: "",
        source: "V8UkvRMXfsvflqA/B1/dc6tAAWkkRpBi7zANPK5e5BA="
      },
      tipMsg: {
        text: "欢迎使用博马物流",
        btnText: "开始使用"
      }
    };
  },
   created() {
   },
  onLoad() {
     this.checktoken()
  },
  methods: {
    goCheck(){
        let customerId=wx.getStorageSync("customerId") || ''
            if (customerId) {
              setTimeout(() => {
                wx.switchTab({
                  url: "/pages/index/main"
                });
              }, 500);
            } else {
              this.$router.push("/pages/user/info/main");
            }
    },
    checktoken(){
      api.userValidate().then(res=>{
        console.log('验证token',res)
        if(res&&res.code==0){
          this.goCheck()
        }
      }).catch(err=>{
        console.log('err',err)
      })
    },
    handleChange(e) {
      this.current = e.target.key;
    },
    failFun() {
      this.tipMsg.text = "为保证您的正常使用，请进行授权！";
      this.tipMsg.btnText = "重新授权";
    },
    checkWx() {
      // 判断小程序的API，回调，参数，组件等是否在当前版本可用。  为false 提醒用户升级微信版本
      // console.log(wx.canIUse('button.open-type.getUserInfo'))
      if (wx.canIUse("button.open-type.getUserInfo")) {
        // 用户版本可用
      } else {
        console.log("请升级微信版本");
      }
    },
    bindGetUserInfo(e) {
      // console.log(e.mp.detail.rawData)
      if (e.mp.detail.rawData) {
        //用户按了允许授权按钮
        console.log("用户按了允许授权按钮");
        this.getUserInfo();
      } else {
        //用户按了拒绝按钮
        console.log("用户按了拒绝按钮");
        this.failFun();
      }
    },
    getUserInfo() {
      // 调用登录接口
      console.log("111");
      wx.login({
        success: res => {
          console.log("wxlog", res);
          this.formData.code = res.code;
          // return
          wx.getUserInfo({
            success: res => {
              console.log("res", res);
              this.formData = { ...this.formData, ...res, ...res.userInfo };
              this.formData.avatarUrl = res.userInfo.avatarUrl;
              wx.setStorageSync("userInfo",JSON.stringify(res.userInfo));
              this.userInfo = res.userInfo;
              this.CustomerLogin();
            },
            fail: err => {
              this.failFun();
            }
          });
        },
        fail: err => {
          this.failFun();
        }
      });
    },
    CustomerLogin() {
      let option = this.formData;
      console.log("option", JSON.stringify(option));
      api.customer
        .Login(option)
        .then(res => {
          console.log("登录res", res);
          if (res && res.code == 0) {
            wx.setStorageSync("token", res.head.token);
            wx.setStorageSync("customerId", res.customerId);
            this.toastSuccess(res.msg || "");
            if (res.customerId) {
              setTimeout(() => {
                wx.switchTab({
                  url: "/pages/index/main"
                });
              }, 500);
            } else {
              this.$router.push("/pages/user/info/main");
            }
          } else {
            this.toastError(res.msg || "");
          }
        })
        .catch(err => {
          console.log("err", err);
          this.toastError("网络繁忙请稍后再试！");
        });
    }
  }
};
</script>


<style scoped>
.login_page {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.login_page > div {
  width: 60%;
  text-align: center;
}
.login_page > div h2 {
  margin-bottom: 20px;
  font-weight: bold;
}
</style>
